<!DOCTYPE html>
<html>
<head>
    <title>Bookmark Cleaner</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div class="confetti-container"></div>
    
    <div class="app-header">
        <nav class="nav-tabs">
            <div class="brand">
                <img src="images/logo.jpg" alt="Lazy Cat Bookmark Cleaner" class="brand-logo">
                <span class="brand-name" data-i18n="brandName">懒猫书签清理</span>
            </div>
            <div class="nav-links">
                <a href="index.html" class="nav-tab">
                    <span class="tab-icon">🔍</span>
                    <span data-i18n="invalidBookmarksTab">失效书签</span>
                </a>
                <a href="duplicates.html" class="nav-tab active">
                    <span class="tab-icon">🔄</span>
                    <span data-i18n="duplicatesTab">重复书签</span>
                </a>
                <a href="profile.html" class="nav-tab">
                    <span class="tab-icon">📊</span>
                    <span data-i18n="profileTab">书签画像</span>
                </a>
                <a href="https://www.ainewtab.app/" class="nav-tab" target="_blank">
                    <span class="tab-icon">📑</span>
                    <span data-i18n="newTab">书签新标签页</span>
                </a>
                <a href="https://www.orionwang.com/about/" class="nav-tab" target="_blank">
                    <span class="tab-icon">👨‍💻</span>
                    <span data-i18n="aboutAuthor">关于作者</span>
                </a>
            </div>
        </nav>
    </div>

    <div class="container">
        <div class="scan-stats-wrapper">
            <div class="stats-container">
                <div class="stat-item">
                    <div class="stat-label" data-i18n="duplicateUrlCount">重复网址</div>
                    <div class="stat-value" id="duplicate-urls">0</div>
                </div>
                <div class="stat-item">
                    <div class="stat-label" data-i18n="duplicateBookmarkCount">重复书签</div>
                    <div class="stat-value" id="duplicate-bookmarks">0</div>
                </div>
            </div>
        </div>

        <div class="duplicate-options" style="display: none;">
            <button class="button primary-button" data-action="keepNewest">
                <span data-i18n="keepNewest">保留最新</span>
            </button>
            <button class="button primary-button" data-action="keepOldest">
                <span data-i18n="keepOldest">保留最早</span>
            </button>
            <button class="button secondary-button" data-action="cancelSelection" style="display: none;">
                <span data-i18n="cancelSelection">取消选择</span>
            </button>
            <button class="button danger-button" data-action="deleteSelected" style="display: none;">
                <span data-i18n="deleteSelected">删除所选</span>
            </button>
        </div>

        <div class="results-container">
            <div class="no-duplicates" style="display: none;">
                <div class="success-state">
                    <div class="success-icon">
                        <img src="images/icon128.png" alt="Happy Cat" class="cat-icon">
                        <div class="success-badge">✓</div>
                    </div>
                    <div class="success-message">
                        <h3 data-i18n="noDuplicatesTitle">未发现重复书签！</h3>
                        <p data-i18n="noDuplicatesDesc">暂时没有发现重复的书签，继续保持哦</p>
                    </div>
                    <div class="success-tips">
                        <p data-i18n="nextScanTip">建议每隔 1-2 个月进行一次检查</p>
                    </div>
                </div>
            </div>
            
            <div class="duplicate-groups">
                <template id="duplicate-group-template">
                    <div class="duplicate-group">
                        <div class="group-header">
                            <div class="group-title">
                                <img class="favicon" src="" alt="">
                                <a class="url" href="" target="_blank"></a>
                            </div>
                            <div class="group-count">
                                <span class="count"></span>
                                <span data-i18n="duplicateItems">重复项目</span>
                            </div>
                        </div>
                        <div class="group-items">
                            <!-- 书签项目将在这里动态插入 -->
                        </div>
                    </div>
                </template>
                
                <template id="bookmark-item-template">
                    <div class="bookmark-item">
                        <div class="item-checkbox">
                            <input type="checkbox" class="keep-checkbox">
                        </div>
                        <div class="item-info">
                            <div class="item-title"></div>
                            <div class="item-meta">
                                <span class="item-location" data-i18n="duplicateLocation">所在位置</span>: 
                                <span class="location-path"></span>
                            </div>
                            <div class="item-meta">
                                <span class="item-date" data-i18n="duplicateAddTime">添加时间</span>: 
                                <span class="add-time"></span>
                            </div>
                        </div>
                    </div>
                </template>
            </div>
        </div>
    </div>

    <div id="preview-container" class="preview-container" style="display: none;">
        <div class="preview-header">
            <div id="preview-title" class="preview-title"></div>
            <button id="preview-close" class="preview-close">&times;</button>
        </div>
        <iframe id="preview-frame" class="preview-frame" sandbox="allow-same-origin allow-scripts"></iframe>
    </div>

    <script type="module" src="duplicates.js"></script>
    <script type="module" src="confetti.js"></script>
    <script src="preview.js"></script>
    <script type="module" src="index.js"></script>
    <script type="module" src="bookmarkProfile.js"></script>
    
</body>
</html> 